<!-- 选择框 -->
<template>
    <div class="xsxz  czjz">
        <div class=" bt">{{mq}}</div>
        <!--  -->
        <div>
            <el-select v-model="xzdnr" :placeholder="mq" class="wbj xzxx " @change="gb">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
            </el-select>
        </div>
    </div>
</template>

<script>


    export default {
        props: ['options', 'mq'],
        data() {
            return {
                xzdnr: ''       // 选择的内容
            };
        },
        methods: {
            gb(value) {
                
                this.$emit('ztsj', value)
            }
        }
    };

</script>

<style scoped>
    /* 垂直居中 */
    .czjz {
        display: flex;
        /* 垂直居中*/
        justify-content: center;

    }





    .xzxx {
        width: 120px;
    }






    .bt {
        width: 65px;
    }

    .xsxz {
        width: 300px;
    }

    /* 加边框 */
    .jbk {
        border: 1px solid salmon;
    }

    /* 水平居中 */
    .czjz {
        display: flex;
        /* 水平居中*/
        align-items: center;
    }

    /* 外边距 */
    .wbj {
        margin: 20px;
    }

    .hz {
        /* 主轴方向 ：横轴*/
        flex-direction: row;

    }
</style>